<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>注册</title>
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/登录.css">
    <link rel="stylesheet" href="css/public.css">
    <link rel="stylesheet" href="css/注册.css">
</head>

<body>
    <header class="header">
        <div class="header_up">
            <h2>YOUR LOGO</h2>
            <span>用户注册</span>
        </div>
    </header>
    <div class="main" id="min">
        <div class="main_top">
            <span>当前位置：首页 > </span>
            <strong>注册</strong>
        </div>
    </div>

    <div class="main_con" id="main_con2">
        <div class="main_con_img">
            <img src="img/arvin-chingcuangco-1337415-unsplash.jpg" alt="">
        </div>
        <div class="main_con_iput" id="input">
            <h3>用户注册</h3>
            <!-- <form> -->
                <div class="main_con_iput_fir" id="main_con_iput_fir2">
                    <span>用户名:&nbsp;</span><input type="text" class="sec">
                </div>
                <div class="main_con_iput_two" id="main_con_iput_two2">
                    <span>手机号:&nbsp;</span><input type="tel" class="fou">
                </div>
                <p class="main_con_iput_thr" id="main_con_iput_thr2">
                    <span>短信验证码: </span><input type="text" id="inp1">
                    <input type="button" value="重新发送" class="six" id="six2">
                </p>
                <p class="main_con_iput_four">
                    <span>密码:&nbsp;</span><input type="password"></span>
                </p>
                <p class="main_con_iput_five">
                    <span>确认密码:&nbsp;</span><input type="password">
                </p>

                <p class="agre">
                    <input type="radio">
                    <span>同意《服务使用协议》</span>
                </p>
                <p class="main_con_iput_thr_end" id="main_con_iput_thr_end2">
                    <input type="submit" value="立即注册">
                </p>
            <!-- </form> -->
        </div>
    </div>
    <footer>
        <div class="footer_up">
            <div class="footer_up_con">
                <div class="footer_up_con_fir">
                    <p class="footer_up_con_fir1">
                        <a href="">联系我们</a>
                        <span>Content us</span>
                    </p>
                    <p class="footer_up_con_fir2">关注</p>
                    <p class="footer_up_con_fir3">您身边的家庭医生</p>
                </div>
                <div class="footer_up_con_two">
                    <div class="footer_up_con_two_img">
                        <span><img src="img/weibo.png" alt=""></span>
                        <span><img src="img/weixin.png" alt=""></span>
                        <span><img src="img/qq.png" alt=""></span>
                    </div>
                    <div class="footer_up_con_two_adress">
                        <p>地址: 北京市朝阳区国贸写字楼B座</p>
                        <p>电话: 400612358</p>
                        <p>邮箱: infor@abgj.com</p>
                    </div>
                    <div class="footer_up_con_two_phone">
                        <p>邮编: 400160</p>
                        <p>手机: 138466066</p>
                    </div>
                </div>

            </div>
        </div>
        <div class="footer_end">
            <p>京公网安备11010125610012号京ICP证150277号京ICP备15002532号</p>
        </div>
    </footer>
</body>
</html>
<!-- 
    当用户名、手机号、验证码、密码、确认密码为空，弹窗
    密码 != 确认密码时，弹窗
    手机号长度 != 11时，弹窗3
    未勾选同意服务，弹窗
 -->
<script>
    var oF=document.getElementById('input');
    var oInput=oF.getElementsByTagName('input');

    oInput[7].onclick=function(){
        if(oInput[0].value==''){
            alert('用户名不能为空');
        }else if(oInput[1].value==''){
            alert('手机号不能为空');
        }else if(oInput[2].value==''){
            alert('请输入验证码');
        }else if(oInput[4].value==''){
            alert('密码不能为空');
        }else if(oInput[5].value==''){
            alert('确认密码不能为空');
        }else if(oInput[6].checked==''){
            alert('请勾选');
        }else if(oInput[1].value.length<11 || oInput[1].value.length>11){
            alert('手机号格式错误!');
        }else if(oInput[4].value!=oInput[5].value){
            alert('密码不一致!!');
        }else{
            register();
        }
    }
    function register(){
        localStorage[oInput[0].value] = oInput[4].value;
        window.location.href = "登录.html";//所有注册信息填写完毕，点击立即注册按钮，跳转到登录页面。
        // console.log(localStorage)
        alert('注册成功!');
    }
</script>